<template>
    <div class="search">
        <van-image
            @click="gototype"
            class="img"
            width="20"
            height="22"
            src="	https://s10.mogucdn.com/mlcdn/c45406/180926_3lac93lkglfd5gd4fiahedg5aad79_40x37.png"
        />
        <van-search
            @click="gotosearch"
            class="sear"
            v-model="value"
            shape="square"
            placeholder="学院风jk套装"
        />
        <van-image
            @click="gotoChat"
            class="imgt"
            width="25"
            height="20"
            src=""
        />
    </div>
</template>

<script>
export default{
    data(){
        return{
            value:'',
        }
    },
    // round
    methods:{
        gototype(){
            this.$router.push('/TypeView')
        },
        gotosearch(){
            this.$router.push('/SearchPage')
        },
        gotoChat(){
            this.$router.push('/ChatPage')
        }
    }
}
</script>

<style lang="scss" scoped>
.search{
    padding: 7.5px 5px;
    height: 30px;
    background-color: #fff;
    border-bottom: 1px solid #e5e5e5;
    display: flex;
    align-items: center;
    .sear{
        flex: 1;
        padding: 5px ;
        .van-search__content{
            background-color: #eee;
        }
        .van-field__control{
            background-color: #eee;
            .van-cell{
                background-color: #eee;
                .van-cell__value{
                    background-color: #eee;
                }
            }
        }
    }
    input:-moz-placeholder,  
    textarea:-moz-placeholder {  
        color: #9e9e9e;  
    }  
    input:-ms-input-placeholder,  
    textarea:-ms-input-placeholder {  
        color: #9e9e9e;  
    }  
    input::-webkit-input-placeholder,  
    textarea::-webkit-input-placeholder {  
        color: #9e9e9e;  
    }
    .img{
        margin: 0px 5px 0px 15px;
    }
    .imgt{
        margin: 0px 15px 0px 2px;
    }
}
</style>